<template name='uploadvideoprogress'>
  {{#with progress}}
    {{#if ipfsAddSourceVideo}}
      <div class="ui indicating progress initbar" data-percent="{{getPercent ipfsAddSourceVideo.progress}}">
        <div class="bar" style="width:{{ipfsAddSourceVideo.progress}}">
        </div>
        <div class="label">
          {{ translate 'UPLOAD_PROGRESS_ADDING_SOURCE_TO_IPFS'}}
          {{#if ipfsAddSourceVideo.positionInQueue}}
          {{ translate 'UPLOAD_PROGRESS_WAITING_IN_QUEUE'}}{{ipfsAddSourceVideo.positionInQueue}}
          {{/if}}
        </div>
      </div>
    {{/if}}

    {{#if sourceAudioCpuEncoding}}
      <div class="ui indicating progress initbar" data-percent="{{getPercent sourceAudioCpuEncoding.progress}}">
        <div class="bar" style="width:{{sourceAudioCpuEncoding.progress}}">
        </div>
        <div class="label">
          {{ translate 'UPLOAD_AUDIO_ENCODING'}}
          {{#if sourceAudioCpuEncoding.positionInQueue}}
            {{ translate 'UPLOAD_PROGRESS_WAITING_IN_QUEUE'}}{{sourceAudioCpuEncoding.positionInQueue}}
          {{/if}}
        </div>
      </div>
    {{/if}}

    {{#if sourceVideoGpuEncoding}}
      <div class="ui indicating progress initbar" data-percent="{{getPercent sourceVideoGpuEncoding.progress}}">
        <div class="bar" style="width:{{sourceVideoGpuEncoding.progress}}">
        </div>
        <div class="label">
          {{ translate 'UPLOAD_GPU_ENCODING'}}
          {{#if sourceVideoGpuEncoding.positionInQueue}}
            {{ translate 'UPLOAD_PROGRESS_WAITING_IN_QUEUE'}}{{sourceVideoGpuEncoding.positionInQueue}}
          {{/if}}
        </div>
      </div>
    {{/if}}

    {{#each encodedVideos}}
      {{#if encode}}
        <div class="ui indicating progress initbar" data-percent="{{getPercent encode.progress}}">
            <div class="bar" style="width:{{encode.progress}}">
            </div>
            <div class="label">
              {{ translate 'UPLOAD_PROGRESS_ENCODING_TO'}} {{encode.encodeSize}}...
              {{#if encode.positionInQueue}}
              {{ translate 'UPLOAD_PROGRESS_WAITING_IN_QUEUE'}}{{encode.positionInQueue}}
              {{/if}}
            </div>
        </div>
      {{/if}}
      {{#if ipfsAddEncodeVideo}}
        <div class="ui indicating progress initbar" data-percent="{{getPercent ipfsAddEncodeVideo.progress}}">
            <div class="bar" style="width:{{ipfsAddEncodeVideo.progress}}">
            </div>
            <div class="label">
              {{ translate 'UPLOAD_PROGRESS_ADDING'}} {{ipfsAddEncodeVideo.encodeSize}} {{ translate 'UPLOAD_PROGRESS_TO_IPFS'}}
              {{#if ipfsAddEncodeVideo.positionInQueue}}
              {{ translate 'UPLOAD_PROGRESS_WAITING_IN_QUEUE'}}{{ipfsAddEncodeVideo.positionInQueue}}
              {{/if}}
            </div>
        </div>
      {{/if}}
    {{/each}}

    {{#if sprite}}
      {{#if sprite.spriteCreation}}
        <div class="ui indicating progress initbar" data-percent="{{getPercent sprite.spriteCreation.progress}}">
            <div class="bar" style="width:{{sprite.spriteCreation.progress}}">
            </div>
            <div class="label">
              {{ translate 'UPLOAD_PROGRESS_CREATING_SPRITE'}}
              {{#if sprite.spriteCreation.positionInQueue}}
              {{ translate 'UPLOAD_PROGRESS_WAITING_IN_QUEUE'}}{{sprite.spriteCreation.positionInQueue}}
              {{/if}}
            </div>
        </div>
      {{/if}}
      {{#if sprite.ipfsAddSprite}}
        <div class="ui indicating progress initbar" data-percent="{{getPercent sprite.ipfsAddSprite.progress}}">
            <div class="bar" style="width:{{sprite.ipfsAddSprite.progress}}">
            </div>
            <div class="label">
              {{ translate 'UPLOAD_PROGRESS_ADDING_SPRITE_TO_IPFS'}}
              {{#if sprite.ipfsAddSprite.positionInQueue}}
              {{ translate 'UPLOAD_PROGRESS_WAITING_IN_QUEUE'}}{{sprite.ipfsAddSprite.positionInQueue}}
              {{/if}}
            </div>
        </div>
      {{/if}}
    {{/if}}
  {{/with}}
</template>